<template >
<div>
  <div id="container" ref="container"></div>
    <input type="text" v-model="option.series[0].data[0]"><br>
    <input type="text" v-model="option.series[0].data[1]">
</div>
  
</template>
<script>
import * as echarts from 'echarts';
    export default{
        data(){
            return{
                option :{
                    title:{text:"睡眠时间"},
        xAxis: {
            // type: 'category',
            data: ['一', '二', '三', '四', '五', '六', '七']
        },
        yAxis: {
            // type: 'value'
        },
        series: [
            {
                data: [180, 200, 100, 118, 115, 157, 130],
                type: 'line'
            },
            // {
            //     data: [150, 230, 224, 218, 135, 147, 260],
            //     type: 'line'
            // }
        ]
    }
            }
        },
        mounted(){
            // this.echart=window.echarts.init(this.$refs.container,"dark")
             this.echart=echarts.init(this.$refs.container,"dark")
            this.echart.setOption(this.option);
        },
        watch:{
            option:{

                handler(){
                    this.echart.setOption(this.option);
                },
                deep:true,
            }
        }
        
    }
</script>
<style>
#container {
  width: 100%;
  height: 80vh;
}
</style>
